<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery-3.3.1.min.js"></script>
    <script>
        //页面加载完成事件
       $(function () {
           //1 给用户名输入框绑定失去焦点事件
           $("#username").blur(function () {
               //2 在事件的匿名函数中,获取用户名
               let username=$(this).val();
               //3 通过ajax发送异步请求,获取结果
               /*
                    $.get(url, [data], [callback], [type])
                    url:请求路径
                    data:请求参数,同样有两种写法,写法1:name=value&name=value...  写法2:{name:value,name:value,...}。
                    callback:响应成功时回调函数。
                    type:返回内容格式，xml, html, script, json, text, _default
                */
               $.get("userServlet",{username:username},function (msg) {
                   //msg就是响应回来的结果,需要展示到username后面的span中
                   $("#username_msg").html(msg);
               },"html")
           });
       })
    </script>
</head>
<body>
    <form>
        账号：<input type="text" name="username" id="username"><span id="username_msg"></span><br>
        密码：<input type="password" name="password" id="password"><br>
        <input type="submit" value="注册">
    </form>

</body>
</html>